<template>
  <div
    v-if="Object.keys(curInvite).length"
    class="easy-container flex content-space-between align-items-center"
  >
    <div class="cell">
      <router-link
        class="title link"
        :to="curInvite.communityUrl"
      >
        {{ curInvite.communityTitle }}
      </router-link>
      邀请本空间加入
    </div>
    <div class="cell flex">
      <el-button
        size="small"
        type="primary"
        @click="handleInvite(true)"
        :loading="loading"
      >
        接受
      </el-button>
      <el-button size="small" @click="handleInvite(false)" :loading="loading">拒绝</el-button>
    </div>
  </div>
</template>

<script>
export default {
  name: 'InvitesListItem', // 邀请列表单元
  props: {
    invite: {
      type: Object,
      required: true,
    },
  },
  data() {
    return {
      curInvite: this.invite,
      loading: false,
    };
  },
  methods: {
    // 处理申请
    handleInvite(state) {
      this.loading = true;
      this.$api.spaces.handleInvite({
        communityId: this.curInvite.communityId,
        inviteId: this.curInvite.id,
        spaceId: this.$route.params.spaceId,
        state,
      }).then(() => { this.$root.$emit('refreshSpacesCommunities'); })
        .catch(() => {})
        .then(() => { this.loading = false; });
    },
  },
};
</script>

<style></style>
